<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ include file="/common/main.jsp" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>视频播放</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
    <link rel="stylesheet" href="${V_PATH}/static/js/jPlayer/jplayer.flat.css" type="text/css" />
    <link rel="stylesheet" href="${V_PATH}/static/css/bootstrap.css" type="text/css" />
    <link rel="stylesheet" href="${V_PATH}/static/css/animate.css" type="text/css" />
    <link rel="stylesheet" href="${V_PATH}/static/css/font-awesome.min.css" type="text/css" />
    <link rel="stylesheet" href="${V_PATH}/static/css/simple-line-icons.css" type="text/css" />
    <link rel="stylesheet" href="${V_PATH}/static/css/font.css" type="text/css" />
    <link rel="stylesheet" href="${V_PATH}/static/css/app.css" type="text/css" />
</head>
<body>
<input type="hidden" id="videoTitle" value="${VIDEO_DETAIL.name}">
<input type="hidden" id="videoUri" value="${VIDEO_DETAIL.videoUri}">
<input type="hidden" id="imgUri" value="${VIDEO_DETAIL.imgUri}">
<input type="hidden" id="commitVideoID" value="${VIDEO_DETAIL.id}">
<section class="vbox">
    <section class="scrollable wrapper-lg">
        <div class="row">
            <div class="span">
                <div class="panel">
                    <!-- video player -->
                    <div id="jp_container_1">
                        <div class="jp-type-single pos-rlt">
                            <div id="jplayer_1" class="jp-jplayer jp-video"></div>
                            <div class="jp-gui">
                                <div class="jp-video-play">
                                    <a class="fa fa-5x text-white fa-play-circle"></a>
                                </div>
                                <div class="jp-interface bg-info padder">
                                    <div class="jp-controls">
                                        <div>
                                            <a class="jp-play"><i class="icon-control-play i-2x"></i></a>
                                            <a class="jp-pause hid"><i class="icon-control-pause i-2x"></i></a>
                                        </div>
                                        <div class="jp-progress">
                                            <div class="jp-seek-bar dker">
                                                <div class="jp-play-bar dk">
                                                </div>
                                                <div class="jp-title text-lt">
                                                    <ul>
                                                        <li></li>
                                                    </ul>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="hidden-xs hidden-sm jp-current-time text-xs text-muted"></div>
                                        <div class="hidden-xs hidden-sm jp-duration text-xs text-muted"></div>
                                        <div class="hidden-xs hidden-sm">
                                            <a class="jp-mute" title="mute"><i class="icon-volume-2"></i></a>
                                            <a class="jp-unmute hid" title="unmute"><i class="icon-volume-off"></i></a>
                                        </div>
                                        <div class="hidden-xs hidden-sm jp-volume">
                                            <div class="jp-volume-bar dk">
                                                <div class="jp-volume-bar-value lter"></div>
                                            </div>
                                        </div>
                                        <div>
                                            <a class="jp-full-screen" title="full screen"><i class="fa fa-expand"></i></a>
                                            <a class="jp-restore-screen" title="restore screen"><i class="fa fa-compress text-lt"></i></a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="jp-no-solution hide">
                                <span>Update Required</span>
                                To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
                            </div>
                        </div>
                    </div>
                    <!-- / video player -->
                    <div class="wrapper-lg">
                        <h2 class="m-t-none text-black">${VIDEO_DETAIL.name}</h2>
                        <div class="post-sum">
                        </div>
                        <div class="line b-b"></div>
                        <div class="text-muted">
                            <i class="fa fa-user icon-muted"></i> by <a href="javascript:;" class="m-r-sm">${VIDEO_DETAIL.author}</a>
                            <i class="fa fa-clock-o icon-muted"></i> ${VIDEO_DETAIL.createdate}
                        </div>
                    </div>
                </div>
                   <!-- 评论开关 -->
                  <c:choose>
                  	<c:when test="${!empty LOGIN_USER}">
                  		<input type="hidden" id="loadCommitId" value="${VIDEO_DETAIL.id}">
                  		<div id="loadCommit"></div>
                  	</c:when>
                  	<c:otherwise>
                  		<div id="loadLogin">
                  			<p id="bootstrap">
					        	<strong>
					        		<a href="JavaScript:;" onclick="loadPage('${V_PATH}/signin.action')">登录/</a>
									<a href="JavaScript:;" onclick="loadPage('${V_PATH}/signup.action')" style="color:red">注册</a>
								</strong>
							</p>
                  		</div>
                  	</c:otherwise>
                  </c:choose>
                  <br>
            </div>
        </div>
    </section>
</section>
<script src="${V_PATH}/static/js/app.plugin.js"></script>
<script type="text/javascript" src="${V_PATH}/static/js/jPlayer/jquery.jplayer.min.js"></script>
<script type="text/javascript" src="${V_PATH}/static/js/jPlayer/add-on/jplayer.playlist.min.js"></script>
<script type="text/javascript" src="${V_PATH}/static/js/jPlayer/demo.js"></script>
<script type="text/javascript" src="${V_PATH}/static/video/video-detail.js"></script>
</body>
</html>